<template>
    <div class="top">
        <top0></top0>
    </div>
    <div style="display: flex;justify-content:center ;align-items: center;"  >
        <div  style="display: flex; justify-self: flex-start;;" >   
            <el-image style="height: 48px; margin-top:20px; margin-left:18px;" :src="'../../../public/images/Logo/FB_text.jpg'"></el-image>
        </div>   
        <div style="display: flex; flex:1;align-items:center ;justify-content: center;flex-direction: column;margin-right:10.5%; margin-top:40px">
            <b style="font-size: 24px; ">
            未来蜂全体人员欢迎您
            </b>
            <span style="font-size: 18px;margin-top: 5px;">我们将竭诚为您服务</span>
        </div>
    </div>
    <el-card style="width: 80%;margin: 3% 10% 0 10% ;">
        <div class="content" style="width: 100%;  height: 100%; padding: 0 10% 0 10%; display: flex; justify-content: center; align-items: center; flex-direction: column;">
    <div class="middle" style="width: 80%;">
      <el-table :data="tableData" style="margin-top:16px;">
        <el-table-column 
          label="姓名" 
          prop="name" 
          align="center"  
          header-align="center"  
        />
        <el-table-column 
          label="职位" 
          prop="title" align="center" 
          header-align="center" 
        >
          <template #default="{ row }">
            <span v-if="row.title === 0">董事长</span>
            <span v-else-if="row.title === 1">经理</span>
            <span v-else-if="row.title === 2">保安</span>
          </template>
        </el-table-column>
        <el-table-column 
          label="联系方式" 
          prop="phone" 
          align="center" 
          header-align="center" 
        />
      </el-table>
    </div>
    <div class="Laws" style="display: flex; justify-content: flex-start; align-items: flex-start; margin-top: 28px; flex-direction: column; padding-left: 20px;">
        <div style="display: flex; justify-content: center; align-items: center;">
            <h3>如有以下情况</h3><h2 style="color:red">请联系我们</h2>
        </div>
        <div>
            1. 有人利用网站进行涉嫌侵权、造谣、传播违法信息（如黄色，暴力，邪教）等行为。
        </div>
        <div>
            2. 利用网站漏洞对他人非法攻击等行为。
        </div>
        <div>
            3. 进行非法获利。
        </div>
        <div>
            4. 未经授权使用、复制或传播网站上的内容。
        </div>
        <div>
            5. 破坏或干扰网站的正常运行，影响他人使用体验。
        </div>
        <div>
            6. 发布虚假广告或误导性信息，欺骗用户。
        </div>
        <div>
            7. 进行网络钓鱼或其他欺诈活动。
        </div>
    </div>


  </div>
    </el-card>
   
   
    <div class="bottom" style="position: fixed;bottom: 0;left: 0;width: 100%;">
        <footer0></footer0>
    </div>
</template>

<script setup>
import {ref } from 'vue'

import top0 from '@/views/top-zjm/top.vue'
import footer0 from '@/views/simpleFooter-lzm/index.vue'

let tableData = ref ([
    {
    name:'六子',
    title:0,
    phone:'12345226952'
},
{
    name:'七子',
    title:1,
    phone:'13345226952'
}
,
{
    name:'八子',
    title:1,
    phone:'14345226952'
}
,
{
    name:'九子',
    title:2,
    phone:'15345226952'
}
,
{
    name:'张加',
    title:2,
    phone:'16345226952'
},
{
    name:'王家',
    title:2,
    phone:'17345226952'
}
])
</script>

<style scoped lang="scss">
.Laws{
    div{
        margin-top:10px;
        font-size:14px;
    }
}
</style>